<%-- 
    Document   : ticketdetails
    Created on : Nov 29, 2009, 10:53:26 PM
    Author     : brian
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>


<%! // declarations go in this kind of tag
    String error;
 %>

 <% // embedded java code goes in this kind of tag
    error = (String)request.getAttribute("error");
    if (error == null)
        error = "";
 %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <%@include file="headtags.html"%>
        <title>Chat</title>

        <script type="text/javascript">
            var chatWindowClicked = false;

            function chatWindowClick(mouseDown) {
                if (mouseDown)
                    chatWindowClicked = true;
                else
                    chatWindowClicked = false;
            }

            var timeOutId = null;
            var lastId = 0;
            function chatHandler(requestType) {
                var xmlhttp = null;
                var request = null;
                var messageEl;
                var chatWindowEl;
                if (window.XMLHttpRequest) {
                    xmlhttp=new XMLHttpRequest();
                } else if (window.ActiveXObject) {
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                } else {
                    alert("Your browser does not support the chat feature.");
                }

                if (!xmlhttp) return;



                xmlhttp.open("POST", "chat.jsp?chat=1&lastId=" + lastId, true);
                xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                if (!requestType) {
                    request=null;
                    xmlhttp.setRequestHeader("Content-length", 0);
                } else {
                    messageEl = document.getElementById("message");
                    request="message=" + messageEl.value;
                    messageEl.value="";
                    xmlhttp.setRequestHeader("Content-length", request.length);
                }
                xmlhttp.setRequestHeader("Connection", "close");
                xmlhttp.onreadystatechange=function() {
                    if (xmlhttp.readyState == 4) {
                        var xmlDoc = xmlhttp.responseXML.documentElement;
                        var error = xmlDoc.getElementsByTagName("error");
                        chatWindowEl=document.getElementById("chatWindow")
                        if (error && error.length) {
                            chatWindowEl.innerHTML+=('<span class="chatError">' + error[0].firstChild.data + "</span><br />\n");
                        } else {
                            var messages = xmlDoc.getElementsByTagName("statement");
                            if (messages) {
                                var i=0;
                                for (i=0;i<messages.length;i++) {
                                    var message = messages[i];
                                    var userName="";
                                    var msg="";
                                    var child;
                                    for (child=message.firstChild;child!=null;child=child.nextSibling) {
                                        if (child.nodeName == "user") {
                                            userName = child.firstChild.data;
                                        } else if (child.nodeName == "message") {
                                           msg = child.firstChild.data;
                                        } else if (child.nodeName == "id") {
                                            lastId = child.firstChild.data;
                                        }
                                    }

                                    if (userName.length) {
                                        chatWindowEl.innerHTML += ('<span class="chatUserName">[' + userName + ']</span>');
                                    }
                                    if (msg.length) {
                                        chatWindowEl.innerHTML += ('<span class="chatMessages">' + msg + '</span>');
                                    }

                                    if (userName.length || msg.length) {
                                        chatWindowEl.innerHTML += "<br />";
                                    }
                                }
                            }
                            var chatters;
                            chatters = xmlDoc.getElementsByTagName("chatter");
                            if (chatters && chatters.length > 0) {
                                var j=0;
                                var chatUsers = document.getElementById("chatUsers");
                                chatUsers.innerHTML = "";
                                for (j=0;j<chatters.length;j++) {
                                    chatUsers.innerHTML += '<span>' + chatters[j].firstChild.data + '</span><br />'
                                }
                            }
                        }
                        
                        chatWindowEl.scrollTop = chatWindowEl.scrollHeight;
                        if (timeOutId != null) clearTimeout(timeOutId)
                        timeOutId=setTimeout("chatHandler(0)", 2000);
                    }
                }
                xmlhttp.send(request);
            }

            function submitMessage(e) {
                var code = 0;
                if (e && e.which) {
                    e = e;
                    code = e.which;
                } else {
                    e = event;
                    code = e.keyCode;
                }

                if (code == 13) {
                    chatHandler(1);
                    return false;
                }

                return true;
            }
        </script>
    </head>
    <body onload="chatHandler(0)">
        <%@include file="menu.html"%>
        <table class="content" width ="100%"><tr class="heading"><td align="center">Chat</td></tr><tr><td>
        <%-- The tag below places the output of the java expression on the page --%>
        <%= error %>

        <div>
          <div id="chatWindow" class="chatWindow" style="height:300px;width:525px;overflow:auto;background-color:white;border-style:solid;border-width:1px;border-color:black;float:left" onmousedown="chatWindowClick(true)" onmouseup="chatWindowClick(false)" onkeypress="return false"></div>
          <div id="chatUsers" class="chatUsers" style="height:300px;width:135px;overflow:auto;background-color:white;border-style:solid;border-width:1px;border-color:black"></div>
        </div>
        <div>
          <textarea id="message" rows="1" cols="80" onkeydown="return submitMessage(event)"></textarea><br />
        </div>
</html>
